<?php
$this->headLink ()->prependStylesheet ( '/lib/jquery-ui/development-bundle/themes/base/jquery.ui.all.css' ); //echo $this->headLink();
?>
<script src="/lib/jquery-ui/js/jquery-ui-1.8.18.custom.min.js"
	type="text/javascript"></script>
<script type="text/javascript">
		$(function() {
			$( "#tabs" ).tabs();
		});
	</script>
<section class="blogger_profile">
	<div id="tabs">
		<ul>
			<li><a href="#info">个人资料</a></li>
			<li><a href="#photo">我的头像</a></li>
			<li><a href="#mail">修改邮箱</a></li>
			<li><a href="#pwd">修改密码</a></li>
		</ul>
		<div id="info">
			<form id="perfect_info" method="post" action="info">
				<table>
					<tbody>
						<tr>
							<td width="150" valign="top" class="right">博客账户：</td>
							<td>
								<div id="username" class="oneline"><?php echo $this->data->nickname?></div>
							</td>
						</tr>
						<tr>
							<td valign="top" class="right">注册时间：</td>
							<td>
								<div class="oneline"><?php echo $this->data->regist_time?></div>
							</td>
						</tr>
						<tr>
							<td valign="top" class="right">真实姓名：</td>
							<td>
								<div class="oneline">
									<input type="text" value="<?php echo $this->data->username;?>"
										maxlength="30" class="inputbox" name="username">
								</div>
							</td>
						</tr>
						<tr>
							<td valign="top" class="right">个人网站：</td>
							<td><input type="text" name="site"
								value="<?php if($this->data->site){echo $this->data->site;}else{echo "http//";}?>"
								class="inputbox" /></td>
						</tr>
						<tr>
							<td valign="top" class="right">自我介绍：</td>
							<td><textarea name="introduce" cols="80" rows="5"
									class="textarea" id="desc"><?php echo $this->data->introduce?></textarea>
							</td>
						</tr>
						<tr>
							<td valign="top" class="right">邮箱：</td>
							<td><?php echo $this->data->email?></td>
						</tr>
						<tr>
							<td valign="top" class="right">QQ：</td>
							<td><input type="text" name="qq" maxlength="12"
								value="<?php echo $this->data->qq?>" class="inputbox" id="qq" />
							</td>
						</tr>
						<tr>
							<td valign="top" class="right">MSN：</td>
							<td><input type="text" name="msn" maxlength="50"
								value="<?php echo $this->data->msn?>" class="inputbox" id="msn" />
							</td>
						</tr>
						<tr>
							<td valign="top" class="right"></td>
							<td class="padding"><input type="submit" value="保存" /></td>
						</tr>
					</tbody>
				</table>
			</form>
		</div>
		<div id="photo">
			<div class="user clfix">
				<form method="post" action="upload" encType="multipart/form-data">
					<div class="img_wrapper">
						<img alt="" src="<?php echo $this->data->photo;?>" id="hd_img">
					</div>
					<input type="hidden" name="type" value="update_photo" /> <span
						class="input-file">浏览...<input type="file" name="file"
						id='fileToUpload'></span> <input class="submit" type="submit"
						value="预览" onclick="return ajaxFileUpload();" />
				</form>
			</div>
			<div class="user_btm">
				<em>从电脑中选择您喜欢的照片：</em><br>你可以上传JPG、JPEG、GIF、PNG或BMP文件，文件最大可支持5MB。
			</div>
			<div class="user_btn">
				<input id="save_photo" type="button" value="保存" />
			</div>
		</div>

		<script type="text/javascript" src="/lib/javascript/ajaxfileupload.js"></script>
		<script type="text/javascript">
			function ajaxFileUpload()
			{
				//return;
				var loading_img = "/lib/javascript/loading.gif";
				var ori_src = $("#hd_img").attr('src');
				$("#hd_img").ajaxStart(function(){
					$(this).attr("src", loading_img);
				});
				$.ajaxFileUpload
				(
					{
						url:'/<?php echo BLOGGER_NAME;?>/blogger/upload',
						secureuri:false,
						fileElementId:'fileToUpload',
						dataType: 'json',
						success: function (data, status)
						{
							//alert(data);
							var obj = jQuery.parseJSON(data);
			
							if(obj.error != '')
							{
								$("#hd_img").attr('src',ori_src);
								alert(obj.error);
							}else{
								//alert(obj.img);
								$("#hd_img").attr("src",'/'+obj.img);
							}
						},
						error: function (data, status, e)
						{
							//alert(e);
						}
					}
				)
				
				return false;
	
			}
			//只是提示信息alert
		   function message(text) {
		       $("#spanmessage").text(text);
		       $("#message").dialog({
		           title:"温馨提示",
		           modal: true,
		           buttons: {
		               "确定": function() {
		                   $(this).dialog("close");
		               }
		           }
		       });
		   }
			//当页面加载完毕时添加一个隐藏的div
			$(function(){
			   var boardDiv = "<div id='message' style='display:none;'><span id='spanmessage'></span></div>";
			   $(document.body).append(boardDiv);
			  
			});
				
			$("#save_photo").click(function(){
				var src = $('#hd_img').attr('src');
				var url = '/<?php echo BLOGGER_NAME?>/blogger/save';
				$("#hd_img").ajaxStart(function(){
					$(this).attr("src", src);
				});
				$.ajax({
					url:url,
					dataType:'text',
					type:'POST',
					data:'path='+src,
					success:function(data){
						message("头像设置成功！");
					}
				}); 
			});
	     </script>
		<div id="mail">
			<form id="update_mail" method="post" action="email">
				<table>
					<tbody>
						<tr>
							<td width="150" valign="top" class="right">登录名：</td>
							<td><input type="text" name="nickname" id="nickname"
								maxlength="30" class="inputbox"></td>
							<td></td>
						</tr>
						<tr>
							<td valign="top" class="right">密码：</td>
							<td><input type="password" name="pwd" id="pd" maxlength="30"
								class="inputbox"></td>
							<td></td>
						</tr>
						<tr>
							<td valign="top" class="right">旧邮箱：</td>
							<td><input type="text" name="oldmail" id="oldmail" maxlength="50"
								class="inputbox"></td>
							<td></td>
						</tr>
						<tr>
							<td valign="top" class="right">新邮箱：</td>
							<td><input type="text" name="newmail" id="newmail" maxlength="50"
								class="inputbox"></td>
							<td><span class="field_notice">（修改邮箱需要重新激活帐户。）</span></td>
						</tr>
						<tr>
							<td valign="top" class="right"></td>
							<td class="padding"><input id="save_mail" type="submit"
								value="保存" /></td>
						</tr>
					</tbody>
				</table>
			</form>
		</div>
		<div id="pwd">
			<form id="update_pwd" method="post" action="pwd">
				<table>
					<tbody>
						<tr>
							<td width="150" valign="top" class="right">旧密码：</td>
							<td><input type="password" name="oldpwd" maxlength="30"
								class="inputbox" id="oldpwd"></td>
							<td></td>
						</tr>
						<tr>
							<td width="150" valign="top" class="right">新密码：</td>
							<td><input type="password" name="newpwd" maxlength="30"
								class="inputbox" id="newpwd"></td>
							<td></td>
						</tr>
						<tr>
							<td width="150" valign="top" class="right">再次输入新密码：</td>
							<td><input type="password" name="confirmpwd" maxlength="30"
								class="inputbox" id="confirmpwd"></td>
							<td></td>
						</tr>
						<tr>
							<td width="150" valign="top" class="right"></td>
							<td class="padding"><input type="submit" value="保存" /></td>
						</tr>
					</tbody>
				</table>
			</form>
		</div>
	</div>
</section>
<script type="text/javascript"
	src="/lib/jquery.plugins/jquery.validate.js"></script>
<script type="text/javascript">
$(function(){
    $('#update_mail').validate({
        errorPlacement: function(error, element){
        	var error_td = element.parents('td').next('td');
            error_td.find('.field_notice').hide();
            error_td.append(error);
        },
        success       : function(label){
            label.addClass('validate_right').text('OK!');
        },
        submitHandler:function(form){
 
				var url = '/<?php echo BLOGGER_NAME?>/blogger/email';
				$.post(url,
					   {ajax:'1',nickname:$("#nickname").val(),pwd:$("#pd").val(),oldmail:$("#oldmail").val(),newmail:$("#newmail").val()},
					   function(data){
						   message(data);
					   });	
				return false;
				
        },   
        onkeyup: false,
        rules : {
            nickname : {
                required : true,
            },
            pwd : {
                required : true,
            },
            oldmail : {
                required : true,
                email    : true,
            },
            newmail : {
           	 	required : true,
              	email    : true,
            }
        },
        messages : {
	       	 nickname : {
	             required : "用户名不能为空",
	         },
        	 pwd  : {
                required : '密码不能为空',
             },
            oldmail : {
                required : '原注册邮箱账号不能为空',
                email	 : "请输入一个有效的电子邮箱地址",
            },
            newmail : {
            	required : '新箱账号不能为空',
           	 	email	 : "请输入一个有效的电子邮箱地址"
            }
        }
    });
});
$(function(){
    $('#update_pwd').validate({
        errorPlacement: function(error, element){
            var error_td = element.parents('td').next('td');
            error_td.find('.field_notice').hide();
            error_td.append(error);
        },
        success       : function(label){
            label.addClass('validate_right').text('OK!');
        },
        submitHandler:function(form){      	 
			var url = '/<?php echo BLOGGER_NAME?>/blogger/pwd';
			$.post(url,
				   {ajax:'1',oldpwd:$("#oldpwd").val(),newpwd:$("#newpwd").val(),confirmpwd:$("#confirmpwd").val()},
				   function(data){
					   message(data);
				   });	
			return false;			
    	},   
        onkeyup: false,
        rules : {
            oldpwd : {
                required : true,
            },
            newpwd : {
                required : true,
                minlength: 6,
            },
            confirmpwd : {
                required : true,
                equalTo  : '#newpwd',
            },
        },
        messages : {
	       	 oldpwd : {
	             required : "请输入原始密码",
	         },
        	newpwd  : {
                required : '密码不能为空',
                minlength: '密码长度不能低于6个字符',
            },
            confirmpwd : {
                required : '确认密码',
                equalTo  : '两次密码输入不一致',
            },
        }
    });
});
</script>